<!DOCTYPE html>
<html>
<head>
	<title>周计划列表</title>
	<meta charset="UTF-8"/>
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<link rel="stylesheet" type="text/css" href="../dist/css/reset.css">
	<link rel="stylesheet" type="text/css" href="../dist/css/atom.css">
	<link rel="stylesheet" type="text/css" href="../dist/css/common.css">
	<link rel="stylesheet" type="text/css" href="../dist/css/font-awesome.min.css">
	<link href="../dist/js/mobiscroll/mobiscroll.core-2.5.2.css" rel="stylesheet" type="text/css" />
	<link href="../dist/js/mobiscroll/mobiscroll.animation-2.5.2.css" rel="stylesheet" type="text/css" />
	<link href="../dist/js/mobiscroll/mobiscroll.android-ics-2.5.2.css" rel="stylesheet" type="text/css" />
</head>
<body>
	<!-- header -->
	<header>
		<div class="left">
			<!-- <span class="logo-graphic">A</span> -->
			<a onclick="javascript:window.history.back();"><i class="fa fa-angle-left"></i><em class="fw-normal">周计划列表</em></a>
		</div>
	</header>
	<!-- header END -->
	<section class="container bg-grey">
		<ul class="tab-bar mgt-1">
			<li><a href="monthlyPlanList.html">月计划(0)</a></li>
			<li class="active">周计划(0)</li>
		</ul>
		<ul class="filter-bar">
			<li class="js-search"><i class="fa fa-search"></i>搜索</li>
			<li class="js-filter"><i class="fa fa-filter"></i>过滤</li>
		</ul>
		<ul class="inspect-blk">
			<li  class="mgt-1">
				<a href="weeklyPlanDetail.html">
					<div class="inspect-info">
						<label>周开始日期：</label><p>2015-10-12</p>
						<label>周结束日期：</label><p>2015-10-18</p>
						<label>主题：</label><p>改改进网页改进网页改进网页改进网页改进网页改进网页改进网页改进网页进网页</p>
						<label>创建日期：</label><p class="longP">2015-10-23</p>
						<label>执行人</label><p class="longP">李宝宝</p>
					</div>
				</a>
			</li>
			<li  class="mgt-1">
				<a href="weeklyPlanDetail.html">
					<div class="inspect-info">
						<label>周开始日期：</label><p>2015-10-12</p>
						<label>周结束日期：</label><p>2015-10-18</p>
						<label>主题：</label><p>改改进网页改进网页改进网页改进网页改进网页改进网页改进网页改进网页进网页</p>
						<label>创建日期：</label><p class="longP">2015-10-23</p>
						<label>执行人</label><p class="longP">李宝宝</p>
					</div>
				</a>
			</li>
			<li  class="mgt-1">
				<a href="weeklyPlanDetail.html">
					<div class="inspect-info">
						<label>周开始日期：</label><p>2015-10-12</p>
						<label>周结束日期：</label><p>2015-10-18</p>
						<label>主题：</label><p>改改进网页改进网页改进网页改进网页改进网页改进网页改进网页改进网页进网页</p>
						<label>创建日期：</label><p class="longP">2015-10-23</p>
						<label>执行人</label><p class="longP">李宝宝</p>
					</div>
				</a>
			</li>
		</ul>
	</section>
	
	<!-- filter 弹出层 -->
	<div class="filter-label fade">
		<span class="type_desc">计划类型</span>
		<ul class="type_desc_list">
			<li class="active"><a href="javascript:void(0)">我的计划</a></li>
			<li><a href="javascript:void(0)">下属计划</a></li>
		</ul>
		<div class="form-control">
			<span class="type_desc">开始日期</span>
			<input type="text" class="timepicker" readonly="readonly" name="startTime" id="startTime" placeholder="2014-12-12 22:23:00 "><i class="fa fa-angle-right fz-1_8"></i>
		</div>
		
		<div class="form-control">
			<span class="type_desc">结束时间</span>
			<input type="text" class="timepicker" readonly="readonly" name="endTime" id="endTime" placeholder="2014-12-12 22:23:00 "><i class="fa fa-angle-right fz-1_8"></i>
		</div>
		<div class="form-control">
			<span class="type_desc">执行人</span>
			<input type="text" name="excutor" id="excutor" placeholder="请输入执行人">
		</div>
		<button class="btn btn-success mgt-1">搜索</button>
		<button class="btn btn-error search-cancel mgt-1">取消</button>
	</div>
	<!-- 查询 弹出层 -->
	<div class="search-panel fade">
		<div class="search-bar">
			<i class="fa fa-search"></i>
			<input type="text" name="search" placehoder="搜索标题,内容,审批类型"/>
		</div>
		<button class="btn btn-success mgt-1">搜索</button>
		<button class="btn btn-error search-cancel mgt-1">取消</button>
	</div>
	
	<script type="text/javascript" src="../dist/js/jquery-3.1.1.js"></script>
	<script type="text/javascript" src="../dist/js/equ.js"></script>
    <script src="../dist/js/mobiscroll/mobiscroll.core-2.5.2.js" type="text/javascript"></script>
	<script src="../dist/js/mobiscroll/mobiscroll.core-2.5.2-zh.js" type="text/javascript"></script>
	<script src="../dist/js/mobiscroll/mobiscroll.datetime-2.5.1.js" type="text/javascript"></script>
	<script src="../dist/js/mobiscroll/mobiscroll.datetime-2.5.1-zh.js" type="text/javascript"></script>

	<script src="../dist/js/mobiscroll/mobiscroll.android-ics-2.5.2.js" type="text/javascript"></script>
	<!-- 下拉菜单组件 -->
	<script type="text/javascript">
		// 搜索和过滤
		$(".js-search").on("click",function(){
			$(".search-panel").removeClass("fade");
			$("#wrapper").addClass("fade");
		});
		$(".js-filter").on("click",function(){
			$(".filter-label").removeClass("fade");
			$("#wrapper").addClass("fade");
		});
		$(".search-cancel").on("click",function(){
			$(this).parent().addClass("fade");
		});

		$(".type_desc_list").find("li").on("click",function(){
			$(this).parent().find("li.active").removeClass("active");
			$(this).addClass("active");
		});
		
        $(function () {
    		var currYear = (new Date()).getFullYear();	
    		var opt={};
    		opt.date = {preset : 'date'};
    		//opt.datetime = { preset : 'datetime', minDate: new Date(2012,3,10,9,22), maxDate: new Date(2014,7,30,15,44), stepMinute: 5  };
    		opt.datetime = {preset : 'datetime'};
    		opt.time = {preset : 'time'};
    		opt.default = {
    			theme: 'android-ics light', //皮肤样式
    	        display: 'modal', //显示方式 
    	        mode: 'scroller', //日期选择模式
    			lang:'zh',
    	        startYear:currYear - 10, //开始年份
    	        endYear:currYear + 10 //结束年份
    		};

    	    var optDateTime = $.extend(opt['datetime'], opt['default']);
    	    var optTime = $.extend(opt['time'], opt['default']);
    	    var optDate = $.extend(opt['date'], opt['default']);

    	    $("#startTime").mobiscroll(optDate).date(optDate);
    	    $("#endTime").mobiscroll(optDate).date(optDate);
        });
	</script>
</body>
</html>